import React, { useState, useEffect } from 'react';
import { Descriptions, message, Tag } from 'antd';
import services from '../../../services/api';
import CodeLabel from '../../../components/CodeLabel';
import StrategyLogs from '../../../components/StrategyLogs';
import storage from '../../../utils/storage';
import './index.less';
import { cloneDeep } from 'lodash';
export default function Detail(props) {
  const [detail, setDetail] = useState({});
  const [baseInfo, setBaseInfo] = useState({});
  const [strategyDetail, setStrategyDetail] = useState({});
  const [returnDetail, setReturnDetail] = useState({});
  const [preFormList, setPreFormList] = useState({});
  const isHaveHitData = Object.keys(storage.HitDetail).length;
  const params = (isHaveHitData && storage.HitDetail.params) || {};
  let actionType = 'eventMonitor';
  const resultOptions = [
    {
      code: 'pass',
      name: '通过',
    },
    {
      code: 'refuse',
      name: '拒绝',
    },
    {
      code: 'review',
      name: '复核',
    },
  ];
  if (isHaveHitData) {
    actionType = storage.HitDetail.actionType;
  }
  useEffect(() => {
    getDetail(props.match.params.id);
  }, []);

  // 获取详情
  function getDetail(id) {
    services[actionType].queryOne({ reqId: id, ...params }).then((res) => {
      if (res.code === '0') {
        setDetail(res.data);
        setBaseInfo(res.data.baseInfo);
        getFlowsDetail(res.data.baseInfo);
      } else {
        message.error(res.msg);
      }
    });
  }

  function getFlowsDetail(val) {
    const params = {
      projectCode: val.projectCode,
      strategyCode: val.strategyCode,
      strategyVersion: val.strategyVersion,
    };
    services.strategyFlow.versionDetail(params).then((res) => {
      if (res.code === '0') {
        const data = cloneDeep(res.data);
        data.config = JSON.parse(res.data.config);
        setStrategyDetail(data);
        const flowParams = {
          code: res.data.code,
          name: res.data.name,
          projectCode: res.data.projectCode,
          config: res.data.config,
        };
        getReturn(flowParams);
        gerPreFrom(flowParams);
      } else {
        message.error(res.msg);
      }
    });
  }

  function getReturn(params) {
    services.strategyFlow.returns(params).then((res) => {
      if (res.code === '0') {
        setReturnDetail(res.data);
      } else {
        message.error(res.msg);
      }
    });
  }

  function gerPreFrom(params) {
    services.strategyFlow.preFormList(params).then((res) => {
      if (res.code === '0') {
        setPreFormList(res.data);
      } else {
        message.error(res.msg);
      }
    });
  }
  return (
    <div className='event-detail'>
      <Descriptions column={3}>
        <Descriptions.Item label='项目'>{baseInfo.projectName}</Descriptions.Item>
        <Descriptions.Item label='请求策略包'>{baseInfo.strategyPackageName}</Descriptions.Item>
        <Descriptions.Item label='策略包版本'>{baseInfo.strategyPackageVersion}</Descriptions.Item>
        <Descriptions.Item label='请求ID'>{baseInfo.reqId}</Descriptions.Item>
        <Descriptions.Item label='请求时间'>{baseInfo.reqTime}</Descriptions.Item>
        <Descriptions.Item label='决策结果'>
          {baseInfo.riskLevel &&
            resultOptions.map((it) => {
              if (it.code === baseInfo.riskLevel) {
                return it.name;
              }
            })}
        </Descriptions.Item>
      </Descriptions>
      <StrategyLogs
        data={detail}
        strategyDetail={strategyDetail}
        preFormList={preFormList}
        returnDetail={returnDetail}
      />
    </div>
  );
}
